﻿<%@ page language="java" contentType="text/html; charset=utf-8"
	pageEncoding="utf-8"%>
<!-- 引入jstl core库 ，使用 循环标签-->
<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c"%>
<!-- 引入jstl fmt库，格式化时间标签 -->
<%@ taglib prefix="fmt" uri="http://java.sun.com/jsp/jstl/fmt"%>
<!-- 开启 EL 表达式支持 -->
<%@ page isELIgnored="false"%>
<c:set var="ctx" value="${pageContext.request.contextPath}" />
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>万能收款码</title>
<style>
* {
	margin: 0;
	padding: 0;
	font-family: Microsoft yahei;
}

body {
	background-color: #fff;
}

.show {
	display: block;
}

.hidden {
	display: none;
}

.code-item {
	width: 100%;
	max-width: 400px;
	margin: 0 auto;
	padding-bottom: 1px;
	display: none;
	background-color: #5c92ef;
}

.code-title {
	height: 100px;
	background-color: #f2f2f2;
	background-position: center;
	background-repeat: no-repeat;
	background-size: 50%;
}

.code-area {
	text-align: center;
}

.code-area>img {
	margin: 80px 0;
	width: 60%;
	min-width: 100px;
}

.code-footer {
	height: 80px;
	text-align: center;
	background-color: #fff;
	color: #666;
	line-height: 80px;
	font-size: 20px;
	margin: -2px 2px 2px 2px;
}

#code-all>.code-title {
	background-image:
		url("");
}

#code-qq {
	background-color: #54b4ef;
}

#code-qq>.code-title {
	background-image:
		url("");
}

#code-wechat {
	background-color: #54bc6e;
}

#code-wechat>.code-title {
	background-image:
		url("");
}

.show {
	display: block !important;
}
.red{
	color:red;
}
</style>

</head>
<body>
	<div class="code-item show" id="code-all">
		<div class="code-title"></div>
		<c:if test="${ 10000 == status}">
			<div class="code-area">
				<img id="pay-url" src="${ctx}/${imagePath}" />
			</div>
			<div class="code-footer">扫描以上二维码向我付款</div>
		</c:if>
		<c:if test="${ 99999 == status}">
			<div class="code-footer red">${msg}</div>
		</c:if>
	</div>
</body>
</html>